<template>
  <view class="myheader ">
	  <view class="header" :style="{ position: headerPosition,top:headerTop,opacity: afterHeaderOpacity }">
		  <!-- logo -->
		  <view  class="logo" @tap="toIndex">
			  <image class="logo-img" src="../../static/img/copoun/JSWB_logo_m.png"></image>
		  </view>
		  <view  class="zhanwei">
		  </view>
		  <!-- 右侧图标按钮 -->
		 <view class="icon-btn">
		  	<view class="icon" @tap="logout">
			 登出
			</view>
		  </view>
		 <hr>
	  </view>
	<view class="place"></view>
  </view>
</template>

<script>
	export default{
		data() {
			return{
				afterHeaderOpacity: 1,//不透明度
				headerPosition: 'fixed',
				headerTop:null,
				backpage:'../../pages/login/login',
				islogin:false,
				headimg:'../../static/img/copoun/person_icon.png'
			}
		},
		mounted() {
			let token=uni.getStorageSync("token_h5")
			//console.log(token)
			if(token){
				 this.headimg='../../static/img/copoun/head_img.png';
			 }
			else{
				  this.headimg='../../static/img/copoun/person_icon.png';
			}
			
			
		},
		methods:{
			toCenter(){
				if(this.islogin!=false){
					uni.navigateTo({
						url: '../user/user'
					});
				};
			},toIndex(){
				 uni.reLaunch({
				 	url: '../Index/index'
				 });
			},logout(){
				
				uni.removeStorageSync("login_time_valid")
				uni.removeStorageSync("token_valid")
				uni.removeStorage({
					key: 'UserList_valid',
					success: function (res) {
						uni.redirectTo({
							url: '/pages/login/login'
						});
						setTimeout(function() {
							uni.showToast({
								title: "退出成功",
								icon: "none"
							});
						}, 400)
					}
				});
			}
		}
	}
</script>

<style lang="scss">
	.header {
		width: 92%;
		padding: 0 4%;
		height: 100upx;
		display: flex;
		align-items: center;
		position: fixed;
		top: 0;
		z-index: 10;
		background-color: #fff;
	    hr{
			    display: block;
			    width: 92%;
			    position: absolute;
			    top: 100upx;
			    background: #D8D8D8;
			    height: 1upx;
			    border: none;
		}
		/*  #ifdef  APP-PLUS  */
		top: var(--status-bar-height);
		/*  #endif  */
	    .logo{
			margin-top: 5px;
			.logo-img{
				width: 330upx;
				height: 66upx;
			}
			
		}
		.zhanwei{
			width: 100%;
		}
		.icon-btn {
			width: 100upx;
			height: 60upx;
			flex-shrink: 0;
			display: flex;
			.icon {
				width: 100upx;
				height: 60upx;
				display: flex;
				justify-content: flex-end;
				align-items: center;
				font-size: 32upx;
				image{
					width: 90%;
					height: 90%;
				}
			}
		}
	}
	.place {
		background-color: #ffffff;
		height: 100upx;
		/*  #ifdef  APP-PLUS  */
		margin-top: var(--status-bar-height);
		/*  #endif  */
	}
</style>
